import React from 'react'
import {Outlet} from "react-router-dom"
import {useSelector,useDispatch} from "react-redux"
//action修改是修改数据的唯一途径 ，action 需要通过dispacth来触发
function Index() {
  let dispatch = useDispatch()
  let store = useSelector((state)=>{
      return state
  })
  let fn = ()=>{
    dispatch({
      type:"setname" // 必须有一个属性叫type  ，执行fn函数时，通过dispach来触发了一个名字为setname的action
    })
  }
  return (
    <div>
        <h1>{store.name}</h1>
        <h1>{store.age}</h1>
        <button onClick={fn}>修改nameo</button>
        <Outlet></Outlet>
    </div>
  )
}

export default Index